<template>
     <div class="right_bottom">
        <CapsuleChart :config="config" style="width: 100%; height: 260px" :data="data" />
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import CapsuleChart from "@/components/datav/capsule-chart";
import { ElMessage } from "element-plus";
import { rightCenter } from "@/api/modules";

const config = ref({
  showValue: true,
  unit: "次",
});

const data = ref([])

function getData(){
    rightCenter().then((res)=>{
        console.log('右中数据====》',res);
        if (res.success) {
        data.value = res.data;
      } else {
        ElMessage({
          message: res.msg,
          type: "warning",
        });
      }
        
    }).catch(err=>{
        ElMessage.error(err)
    })
}

onMounted(()=>{
    getData()
})
</script>

<style lang="scss" scoped>
.right_bottom {
  box-sizing: border-box;
  padding: 0 16px;
}
</style>